<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>运输配送管理</title>
    <!-- 导入jquery核心类库 -->
    <script type="text/javascript" src="../../js/jquery-1.8.3.js"></script>
    <!-- 导入easyui类库 -->
    <link rel="stylesheet" type="text/css" href="../../js/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../../js/easyui/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="../../js/easyui/ext/portal.css">
    <link rel="stylesheet" type="text/css" href="../../css/default.css">
    <script type="text/javascript" src="../../js/easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="../../js/easyui/ext/jquery.portal.js"></script>
    <script type="text/javascript" src="../../js/easyui/ext/jquery.cookie.js"></script>
    <script src="../../js/easyui/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=obQpqavf9Lr2vG95RLA5EZGGVyIzgR4R"></script>
    <script type="text/javascript">
        $(function () {
            // 先将body隐藏，再显示，不会出现页面刷新效果
            $("body").css({
                visibility: "visible"
            });

            var transitToolbar = [{
                id: 'button-inoutstore',
                text: '出入库',
                iconCls: 'icon-add',
                handler: function () {
                    $("#inoutstoreWindow").window('open');
                }
            }, {
                id: 'button-delivery',
                text: '开始配送',
                iconCls: 'icon-print',
                handler: function () {
                    $("#deliveryWindow").window('open');
                }
            }, {
                id: 'button-sign',
                text: '签收录入',
                iconCls: 'icon-save',
                handler: function () {
                    const row = $('#transitGrid').datagrid('getSelected');
                    if (row == null) {
                        $.messager.alert("警告", "暂无数据信息!", 'warning')
                        return
                    }
                    //进行表单域操作
                    $('#wayBillId').val(row.id);
                    //console.log(JSON.stringify(row))
                   /* $('#tranOutSitInfoView').append('运单编号：'+row.wayBillNum ? row.wayBillNum:'暂无'+'<br/>');
                    $('#tranOutSitInfoView').append('运单发货地址：'+row.sendAddress ? row.sendAddress:'暂无'+'<br/>');
                    $('#tranOutSitInfoView').append('运单收件地址：：'+row.recAddress ? row.recAddress:'暂无'+'<br/>');*/
                    $('#tranOutSitInfoView').append('运单编号：'+row.wayBillNum ? row.wayBillNum:"暂无"+'<br/>');
                    $('#tranOutSitInfoView').append('运单发货地址：'+row.sendAddress? row.sendAddress:"暂无"+'<br/>');
                    $('#tranOutSitInfoView').append('运单收件地址：：'+row.recAddress? row.recAddress:"暂无"+'<br/>');
                    $("#signWindow").window('open');
                }
            }, {
                id: 'button-transit',
                text: '运输路径',
                iconCls: 'icon-search',
                handler: function () {
                    // 弹出窗口
                    const row = $('#transitGrid').datagrid('getSelected');
                    if (row == null) {
                        $.messager.alert("警告", "暂无地址信息!", 'warning')
                        return
                    }
                    // 百度地图API功能
                    var map = new BMap.Map("transitPathWindow");
                    var start = row.wayBill.sendAddress;
                    var end = row.wayBill.recAddress;
                     map.centerAndZoom('北京', 11);
                    //三种驾车策略：最少时间，最短距离，避开高速
                    var routePolicy = [BMAP_DRIVING_POLICY_LEAST_TIME,BMAP_DRIVING_POLICY_LEAST_DISTANCE,BMAP_DRIVING_POLICY_AVOID_HIGHWAYS];

                        var driving = new BMap.DrivingRoute(map, {renderOptions:{map: map, autoViewport: true},policy: routePolicy[0]});
                        driving.search(start,end);
                    //显示地图逻辑
                    $("#transitPathWindow").window('open');
                }
            }, {
                id: 'button-path',
                text: '实时配送路径',
                iconCls: 'icon-search',
                handler: function () {
                    $("#deliveryInTimePathWindow").window('open');
                }
            }];

            var transitColumns = [
                [{
                    field: 'id',
                    title: '编号',
                    width: 30
                }, {
                    field: 'wayBillNum',
                    title: '运单号',
                    width: 100,
                    formatter: function (data, row, index) {
                        if (row.wayBill.wayBillNum != undefined) {
                            return row.wayBill.wayBillNum;
                        }
                    }
                }, {
                    field: 'sendName',
                    title: '寄件人姓名',
                    width: 100,
                    formatter: function (data, row, index) {
                        return row.wayBill.sendName;
                    }

                }, {
                    field: 'sendAddress',
                    title: '寄件地址',
                    width: 100,
                    formatter: function (data, row, index) {
                        return row.wayBill.sendAddress;
                    }
                }, {
                    field: 'recName',
                    title: '收件人姓名',
                    width: 100,
                    formatter: function (data, row, index) {
                        return row.wayBill.recName;
                    }
                }, {
                    field: 'recAddress',
                    title: '收件地址',
                    width: 100,
                    formatter: function (data, row, index) {
                        return row.wayBill.recAddress;
                    }
                }, {
                    field: 'goodsType',
                    title: '托寄物',
                    width: 100,
                    formatter: function (data, row, index) {
                        return row.wayBill.goodsType;
                    }
                }, {
                    field: 'status',
                    title: '运输状态',
                    width: 100
                }, {
                    field: 'outletAddress',
                    title: '网点地址',
                    width: 100
                }, {
                    field: 'transferInfo',
                    title: '物流信息',
                    width: 100
                }]
            ];

            // 运输配送管理 表格定义
            $('#transitGrid').datagrid({
                iconCls: 'icon-forward',
                url: '../../transit_findAll.action',
                fit: true,
                border: false,
                rownumbers: true,
                striped: true,
                pageList: [20, 50, 100],
                pagination: true,
                idField: 'id',
                singleSelect: true,
                toolbar: transitToolbar,
                columns: transitColumns
            });

        });
    </script>
</head>

<body class="easyui-layout" style="visibility:hidden;">

<div data-options="region:'center'">
    <table id="transitGrid"></table>
</div>

<div class="easyui-window" title="出入库" id="inoutstoreWindow" modal="true" closed="true" collapsible="false"
     minimizable="false" maximizable="false" style="top:100px;left:200px;width: 600px; height: 300px">
    <div region="north" style="height:30px;overflow:hidden;" split="false" border="false">
        <div class="datagrid-toolbar">
            <a id="inoutStoreSave" icon="icon-save" href="#" class="easyui-linkbutton" plain="true">保存</a>
        </div>
    </div>
    <div region="center" style="overflow:auto;padding:5px;" border="false">
        <form id="inoutStoreForm" method="post" action="">
            <table class="table-edit" width="80%" align="center">
                <tr class="title">
                    <td colspan="2">入库操作</td>
                </tr>
                <tr>
                    <td>运单信息</td>
                    <td>
                        <input type="hidden" name="id" id="inOutStoreId"/>
                        <span id="transitInfoView"></span>
                </tr>
                <tr>
                    <td>操作</td>
                    <td>
                        <select name="operation" class="easyui-combobox">
                            <option value="入库">入库</option>
                            <option value="出库">出库</option>
                            <option value="到达网点">到达网点</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>仓库或网点地址</td>
                    <td>
                        <input type="text" name="address" size="40"/>
                    </td>
                </tr>
                <tr>
                    <td>描述</td>
                    <td>
                        <textarea rows="3" cols="40" name="description"></textarea>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>

<div class="easyui-window" title="开始配送" id="deliveryWindow" modal="true" closed="true" collapsible="false"
     minimizable="false" maximizable="false" style="top:100px;left:200px;width: 600px; height: 300px">
    <div region="north" style="height:30px;overflow:hidden;" split="false" border="false">
        <div class="datagrid-toolbar">
            <a id="deliverySave" icon="icon-save" href="#" class="easyui-linkbutton" plain="true">保存</a>
        </div>
    </div>
    <div region="center" style="overflow:auto;padding:5px;" border="false">
        <form id="deliveryForm" method="post" action="">
            <table class="table-edit" width="80%" align="center">
                <tr class="title">
                    <td colspan="2">开始配送</td>
                </tr>
                <tr>
                    <td>运单信息</td>
                    <td>
                        <input type="hidden" name="id" id="deliveryId"/>
                        <span id="transitInfoView"></span>
                </tr>
                <tr>
                    <td>快递员工号</td>
                    <td>
                        <input type="text" required="true" name="courierNum"/>
                    </td>
                </tr>
                <tr>
                    <td>快递员姓名</td>
                    <td>
                        <input type="text" required="true" name="courierName"/>
                    </td>
                </tr>
                <tr>
                    <td>描述</td>
                    <td>
                        <textarea rows="3" cols="40" name="description"></textarea>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>

<div class="easyui-window" title="签收录入" id="signWindow" modal="true" closed="true" collapsible="false"
     minimizable="false" maximizable="false" style="top:100px;left:200px;width: 600px; height: 300px">
    <div region="north" style="height:30px;overflow:hidden;" split="false" border="false">
        <div class="datagrid-toolbar">
            <a id="signSave" icon="icon-save" href="#" class="easyui-linkbutton" plain="true">保存</a>
        </div>
    </div>
    <div region="center" style="overflow:auto;padding:5px;" border="false">
        <form id="signForm" method="post" action="">
            <table class="table-edit" width="80%" align="center">
                <tr class="title">
                    <td colspan="2">签收录入</td>
                </tr>
                <tr>
                    <td>运单信息</td>
                    <td>
                        <input type="hidden" name="id" id="wayBillId"/>
                        <span id="tranOutSitInfoView"></span>
                </tr>
                <tr>
                    <td>签收人</td>
                    <td>
                        <input type="text" required="true" name="signName"/>
                    </td>
                </tr>
                <tr>
                    <td>签收日期</td>
                    <td>
                        <input type="text" class="easyui-datebox" required="true" name="signTime"/>
                    </td>
                </tr>
                <tr>
                    <td>签收状态</td>
                    <td colspan="3">
                        <select class="easyui-combobox" style="width:150px" name="signType">
                            <option value="正常">正常</option>
                            <option value="返单">返单</option>
                            <option value="转发签收">转发签收</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>异常备注</td>
                    <td>
                        <textarea name="errorRemark" rows="4" cols="40"></textarea>
                    </td>
                </tr>
                <tr>
                    <td>描述</td>
                    <td>
                        <textarea rows="3" cols="40" name="description"></textarea>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>

<div class="easyui-window" title="运输路径查看" id="transitPathWindow" modal="true" closed="true" collapsible="false"
     minimizable="false" maximizable="false" style="top:20px;left:100px;width: 800px; height: 400px">
</div>

<div class="easyui-window" title="实时配送路径" id="deliveryInTimePathWindow" modal="true" closed="true" collapsible="false"
     minimizable="false" maximizable="false" style="top:20px;left:100px;width: 800px; height:400px">
</div>
</body>

</html>